<template>
  <div id="info">
    <!-- 记录数据表 -->
    <history :class="{ isVisible: addressIsVisible }" />
    <!-- 城市 -->
    <address-list-comp
      :list="addressList"
      :class="{ isVisible: !addressIsVisible }"
      :addressIsVisible.sync="addressIsVisible"
    />
    <!-- 贷款 -->
    <likeTableList
      :list="loanAmount.loanAmountList"
      :class="{ isVisible: !loanAmount.isVisible || addressIsVisible }"
      :title="loanAmount.title"
      :isVisible.sync="loanAmount.isVisible"
    />
    <!-- 教育 -->
    <likeTableList
      :list="educationalStatus.educationalStatusList"
      :class="{
        isVisible: !educationalStatus.isVisible || loanAmount.isVisible,
      }"
      :title="educationalStatus.title"
      :isVisible.sync="educationalStatus.isVisible"
    />
    <!-- 贷款目的 -->
    <likeTableList
      :list="purposesOfCredit.purposesOfCreditList"
      :class="{
        isVisible: !purposesOfCredit.isVisible || educationalStatus.isVisible,
      }"
      :title="purposesOfCredit.title"
      :isVisible.sync="purposesOfCredit.isVisible"
    />
    <!-- 贷款时间 -->
    <likeTableList
      :list="loanTime.loanTimetList"
      :class="{
        isVisible: !loanTime.isVisible || purposesOfCredit.isVisible,
      }"
      :title="loanTime.title"
      :isVisible.sync="loanTime.isVisible"
    />
    <!-- <myPicker/> -->
    <!--  -->
  </div>
</template>

<script>
import { getaddress } from "@/api/address";
import addressListComp from "./components/AddressListComp/index";
import likeTableList from "./components/LikeTableList/index";
import history from "./components/History/index";
import myPicker from "./components/myPicker/index";
export default {
  name: "",
  data() {
    return {
      addressList: [],
      addressIsVisible: true,
      loanAmount: {
        title: "贷款额度",
        loanAmountList: [
          {
            id: 1,
            content: "2-3万",
          },
          {
            id: 2,
            content: "3-5万",
          },
          {
            id: 3,
            content: "5-10万",
          },
          {
            id: 4,
            content: "10-20万",
          },
          {
            id: 5,
            content: "20-50万",
          },
          {
            id: 6,
            content: "50-100万",
          },
        ],
        isVisible: true,
      },
      educationalStatus: {
        title: "教育程度",
        educationalStatusList: [
          {
            id: 1,
            content: "初中",
          },
          {
            id: 2,
            content: "高中",
          },
          {
            id: 3,
            content: "中专",
          },
          {
            id: 4,
            content: "大专",
          },
          {
            id: 5,
            content: "本科及以上",
          },
        ],
        isVisible: true,
      },
      purposesOfCredit: {
        title: "贷款目的",
        purposesOfCreditList: [
          {
            id: 1,
            content: "购房贷款",
          },
          {
            id: 2,
            content: "装修贷款",
          },
          {
            id: 3,
            content: "购车贷款",
          },
          {
            id: 4,
            content: "教育培训贷款",
          },
          {
            id: 5,
            content: "旅游贷款",
          },
          {
            id: 6,
            content: "医疗贷款",
          },
        ],
        isVisible: true,
      },
      loanTime: {
        title: "贷款时间",
        loanTimetList: [
          {
            id: 1,
            content: "1-3月",
          },
          {
            id: 2,
            content: "3-6月",
          },
          {
            id: 3,
            content: "6-12月",
          },
          {
            id: 4,
            content: "12-24月",
          },
          {
            id: 5,
            content: "大于24月",
          },
        ],
        isVisible: true,
      },
    };
  },
  components: {
    addressListComp,
    likeTableList,
    history,
    myPicker
  },
  methods: {
    async api_getaddress() {
      let { data } = await getaddress();
      //console.log(data.data);
      this.addressList = data.data.addreess;
    },
  },

  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.api_getaddress();
  },
};
</script>

<style scoped>
#info {
  height: 100vh;
  padding: 0 10px;
}
.isVisible {
  display: none;
}
</style>